import {
  // unstable_HistoryRouter as HistoryRouter,
  HashRouter,
  Routes, Route
} from 'react-router-dom'
// import { history } from './utils'

import { AuthComponent } from '@/components/AuthComponent'
// import SocketProvider from '@/components/SocketProvider'
import { lazy, Suspense } from 'react'

// 按需导入组件
const Login = lazy(() => import('./pages/Login'))
const Layout = lazy(() => import('./pages/Layout'))
const Home = lazy(() => import('./pages/Home'))
// const Variety = lazy(() => import('./pages/Variety'))
// const Warningroup = lazy(() => import('./pages/Warningroup'))
const Signal = lazy(() => import('./pages/Signal'))
const Ws = lazy(() => import('./pages/Ws'))
const Historical = lazy(() => import('./pages/Historical'))
const Panel = lazy(() => import('./pages/Panel'))
const OrderList = lazy(() => import('./pages/OrderList'))
const PoolConfig = lazy(() => import('./pages/PoolConfig'))

export default function App () {
  return (
    // <SocketProvider>
    <div className="App">
      <Suspense
        fallback={
          <div
            style={{
              textAlign: 'center',
              marginTop: 200
            }}
          >
            loading...
          </div>
        }
      >
        <HashRouter>
          <Routes>
            {/* 创建路由path和组件对应关系 */}
            {/* Layout需要鉴权处理的 */}
            {/* 这里的Layout不一定不能写死 要根据是否登录进行判断 */}
            <Route path='/' element={
              <AuthComponent>
                <Layout />
              </AuthComponent>
            }>
              <Route index element={<Home />}></Route>
              <Route path='signal' element={<Signal />}></Route>
              <Route path='historical' element={<Historical />}></Route>
              <Route path='orderList' element={<OrderList />}></Route>
              <Route path='poolConfig' element={<PoolConfig />}></Route>
              <Route path='ws' element={<Ws />}></Route>

              {/* <Route path='variety' element={<Variety />}></Route> */}
              {/* <Route path='warningroup' element={<Warningroup />}></Route> */}
              {/* <Route path='publish' element={<Publish />}></Route> */}
            </Route>
            {/* 这个不需要 */}
            <Route path='/login' element={<Login />}></Route>
            <Route path='/panel' element={<Panel />}></Route>
          </Routes>
        </HashRouter>
      </Suspense>
    </div>
    // </SocketProvider>
  )
}